<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        .box1{
            width: 400px;
            height: 400px;
            border: 10px red double;
            padding: 40px;

            /*background-size: cover;*/

            /*
                background-clip
                - 设置背景图片显示的区域
                - 可选值：
                    border-box 默认值，背景会延伸到边框的下边
                    padding-box 背景会延伸到内边距下
                    content-box 背景只会在内容区中显示

                background-origin
                - 设置背景图片定位的原点
                - 可选值：
                    padding-box 默认值，背景相对于padding定位
                    border-box 背景相对于边框定位
                    content-box 背景相对于内容区定位
            */
            /*background-clip: content-box;*/

            /*background-position: 0 0;*/

            /*background-origin: content-box;*/

            background: #bfa url("images/2.jpeg") no-repeat 0 0/cover border-box content-box;

            /*background-image: linear-gradient(0deg, blue,yellow,orange,red);*/
        }
    </style>
</head>
<body>
<div class="box1"></div>
</body>
</html>